import { cn } from "@/utils/twMerge";
import React from "react";

const table = (props: any) => {
  const { data } = props;
  return (
    <div className={cn("h-[300px] bg-white   rounded-md p-4", data?.width)}>
      <div className="text-xl h-10">{data?.title}</div>
      <div className="border-gray-200 border-solid border-1 w-full h-[calc(100%_-_2.5rem)]  overflow-hidden">
        <div className="border-gray-200 border-solid border-1 h-10 flex flex-wrap justify-center items-center ">
          <div className=" w-1/3">姓名</div>
          <div className=" w-1/3">部门</div>
          <div className=" w-1/3">工龄</div>
        </div>
        <div className="overflow-auto h-full">
          {data?.list.map((item: any, index) => {
            return (
              <div
                key={index}
                className="border-gray-200 border-solid border-1 h-10 flex flex-wrap justify-center items-center"
              >
                <div className=" w-1/3">{item.name}</div>
                <div className=" w-1/3">{item.partment}</div>
                <div className=" w-1/3">1</div>
              </div>
            );
          })}
        </div>
      </div>
    </div>
  );
};

export default table;
